<template>
  <div id="app">
    <router-view></router-view>
    <ul class="nav">
      <li>
        <router-link to="/shouye">首页</router-link>
      </li>
      <li>
        <router-link to="/fenlei">分类</router-link>
      </li>
      <li>
        <router-link to="/car">购物车</router-link>
      </li>
      <li>
        <router-link to="/weilogin">未登录</router-link>
      </li>
    </ul>
  </div>
</template>

<script>

export default {
  name: 'App',
  data() {
    return {
      
    };
  },
  mounted(){
    
  },
  components: {
    
  },
  methods:{
    
  },
  computed:{
    
  },
};
</script>

<style lang="scss" scoped>
  #app{
    .nav{
      display: flex;
      justify-content: space-around;
      align-items: center;
      width: 100%;
      height: 100px;
      font-size: 28px;
      background-color: white;
      position: fixed;
      bottom: 0;
      li{
        a{
          text-decoration: none;
          color: black;
        }
        .router-link-active {
          color: red;
        }
      }
    }
  }
</style>
